<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
  <style>
    table {
      border-collapse: collapse;
      text-align: center;
    }

    /* tr.head {
      font-weight: 700;
      font-size: 20px;
    } */

    /* n的取值: 0和整数  */
    /* 0, 1, 2, 3, 4, 5, 6......... */
    /*
    选择表格中的前两行
       n css变量 n取值范围: 0,1,2,3,4,5,6......
      -n  0 -1 -2 -3 -4 -5 -6......
      -n+2  0+2 -1+2 -2+2 -3+2 -4+2 -5+2......
          结果 2 1 0 -1 -2 -3......
          浏览器只会取正数值 2 1   ;选择前两行，没有0行
    */
    table tr:nth-child(-n + 2) {

      font-weight: 700;
      font-size: 20px;
    }

    /* 属性选择器 */
    table tr td[rowspan] {
      font-weight: 700;
      font-size: 18px;
    }

    td {
      border: 1px solid red;
      width: 100px;
      height: 30px;
    }
  </style>
</head>
<body>
  
  <table>
    <tr>
      <td colspan="6">课程表</td>
    </tr>
    <tr>
      <td></td>
      <td>星期一</td>
      <td>星期二</td>
      <td>星期三</td>
      <td>星期四</td>
      <td>星期五</td>
    </tr>
    <tr>
      <td rowspan="4">上午</td>
      <td>数学</td>
      <td>数学</td>
      <td>数学</td>
      <td>数学</td>
      <td>数学</td>
    </tr>
    <tr>
      <td>数学</td>
      <td>数学</td>
      <td>数学</td>
      <td>数学</td>
      <td>数学</td>
    </tr>
    <tr>
      <td>数学</td>
      <td>数学</td>
      <td>数学</td>
      <td>数学</td>
      <td>数学</td>
    </tr>
    <tr>
      <td>数学</td>
      <td>数学</td>
      <td>数学</td>
      <td>数学</td>
      <td>数学</td>
    </tr>
    <tr>
      <td rowspan="4">下午</td>
      <td>数学</td>
      <td>数学</td>
      <td>数学</td>
      <td>数学</td>
      <td>数学</td>
    </tr>
    <tr>
      <td>数学</td>
      <td>数学</td>
      <td>数学</td>
      <td>数学</td>
      <td>数学</td>
    </tr>
    <tr>
      <td>数学</td>
      <td>数学</td>
      <td>数学</td>
      <td>数学</td>
      <td>数学</td>
    </tr>
    <tr>
      <td>数学</td>
      <td>数学</td>
      <td>数学</td>
      <td>数学</td>
      <td>数学</td>
    </tr>
    <tr>
      <td rowspan="2">晚自习</td>
      <td>数学</td>
      <td>数学</td>
      <td>数学</td>
      <td>数学</td>
      <td>数学</td>
    </tr>
    <tr>
      <td>数学</td>
      <td>数学</td>
      <td>数学</td>
      <td>数学</td>
      <td>数学</td>
    </tr>
  </table>

</body>
</html>